<?php require_once LAYOUTPATH.'layout_header.php'; ?>

<?php if (!$bricabox->can_clone): ?>
<h1>Sorry, the owner of <a href="<?php echo str_replace('://', "://{$bricabox->subdomain}.", APP_ROOT_URL); ?>"><?php echo $bricabox->name; ?></a> has disabled cloning.</h1>
<?php else: ?>
	<?php if ($bricabox->is_seed): ?>
	<h1>Create a new <?php echo $bricabox->name; ?></h1>
	<?php else: ?>
	<h1>Create a BricaBox like <?php echo $bricabox->name; ?></h1>
	<?php endif; ?>
	
	<?php require_once FLASHPARTIAL; ?>
	
	<?php if ($bricabox->is_seed): ?>
	<h2><?php echo $bricabox->description; ?></h2>
	<?php endif; ?>
	
	<div id="blocks" style="margin-top: 13px;">
		<div id="blocks_small" class="column">
			<?php if (!$this->userland->logged_in()): ?>
			<h1 style="font-size: 18px; line-height: 22px;">You're almost there! <a style="border: none; color: #0085cf;" href="/sign_up_or_log_in">Sign up or log in</a> to create your new BricaBox.</h1>
			<div style="margin-top: 8px;">
				<img src="/assets/images/clone_blank_slate.png" alt="This is what the form will look like after you log in" />
			</div>
			<?php else: ?>
			<form action="/bricabox/<?php echo $bricabox->id; ?>/create_clone" method="post" onsubmit="return checkForm();">
				<fieldset>
					<div>
						<label for="bricabox_name"><span class="req">*</span>Name your new BricaBox:</label><br />
						<input style="font-size: 18px;" type="text" id="bricabox_name" name="bricabox[name]" value="" />
					</div>

					<div>
						<label for="bricabox_subdomain"><span class="req">*</span>Choose a subdomain:</label><br />
						<input onchange="checkSubdomain();" onkeyup="checkSubdomain();" style="font-size: 18px; width: 75px;" type="text" id="bricabox_subdomain" name="bricabox[subdomain]" value="" />.<?php echo str_replace('http://', '', APP_ROOT_URL); ?><br />
						<div id="subdomain_check"></div>
					</div>

					<div class="controls">
						<input type="submit" id="submit_button" value="Create my new BricaBox!" style="font-size: 18px;" />
					</div>
				</fieldset>
			</form>
			<?php endif; ?>
		</div>
		
		<div id="blocks_large" class="column">
			<iframe id="site_preview" name="site_preview" src="<?php echo str_replace('://', "://{$bricabox->subdomain}.", APP_ROOT_URL); ?>/" width="570px" height="400px" scrolling="no" frameborder="0" style="border: 3px solid #f5f5f5;"></iframe>
		</div>
	</div>
	
	<script type="text/javascript" charset="utf-8">
		var el = document.getElementById('site_preview');
		el.location = '<?php echo str_replace('://', "://{$bricabox->subdomain}.", APP_ROOT_URL); ?>/';
	</script>
	
	<?php if ($this->userland->logged_in()): ?>
	<script type="text/javascript" charset="utf-8">
		function checkForm()
		{
			checkSubdomain();
			
			var name = $('#bricabox_name');
			var subd = $('#bricabox_subdomain');
			if (name.val() == "" || subd.val() == "")
			{
				alert("You must choose a name and a subdomain.");
				if (name.val())
					subd.focus();
				else
					name.focus();
					
				return false;
			}
			$('#submit_button').attr('disabled', true);
		}
		
		function checkSubdomain()
		{
			var subd = $('#bricabox_subdomain');
			if (subd.val() != "")
			{
				$('#subdomain_check').load('/bricabox/<?php echo $bricabox->id; ?>/check_subdomain', {subdomain: subd.val()});
			}
		}
		
		$('#bricabox_name').focus();
	</script>
	<?php endif; ?>
	
<?php endif; ?>

<?php require_once LAYOUTPATH.'layout_footer.php'; ?>